import CompareList from './CompareList';
import './CompareListSection.scss';
const CompareListSection = ({
  isLogin,
  isShow,
  onClose,
}: {
  isLogin: boolean;
  isShow?: boolean;
  onClose?: Fn;
}) => {
  const handleClosePanel = () => {
    onClose && onClose();
  };
  return (
    <div className={'panel-mobile-comparelist ' + (isShow && 'panel-show')}>
      <div className="panel-mobile-comparelist-header">
        <div className="panel-mobile-comparelist-header-title">
          <button
            className="panel-mobile-comparelist-header-close"
            onClick={handleClosePanel}
          >
            <span className="iconfont icon-close"></span>
          </button>
          <span>Compare</span>
        </div>
      </div>
      <div className="panel-mobile-comparelist-contents">
        <div className="panel-mobile-comparelist-contents-wrapper">
          {isLogin && <CompareList />}
        </div>
      </div>
    </div>
  );
};

export default CompareListSection;
